<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" type="image/x-icon" th:href= "@{/static/img/timg.jpg}">
    <title>我的购物车</title>
    <link th:href="@{../../static/css/likeFooter.css}" rel="stylesheet">
    <link rel="stylesheet" href="../../static/css/shoppingCart.css">
    <link rel="stylesheet" th:href="@{/static/css/TandC.css}">
    <link rel="stylesheet" href="../../static/css/shoppingTrolley.css">
</head>
<body>
<!--顶部+搜索+侧边-->
<div th:include="like/likeHead :: common"></div>
    <!--中间的主体部分-->
<div class="st-content">
        <div class="st-all">
            <div class="st-all-left">
                <a href="###">全部商品<span class="number" th:text="${carDate.size()}"></span></a>
            </div>
        </div>
<!--        加入购物车的商品-->
        <div class="shopping-goods" >
<!--            顶部的全选和标签-->
            <div class="shopping-check">
                <div class="check-all">
                    <input type="checkbox" class="check-father">全选
                </div>
                <div class="check-goods">商品</div>
                <div>单价</div>
                <div class="check-quantity">数量</div>
                <div>小计</div>
                <div class="check-action">操作</div>
            </div>
<!--            商品-->
            <div class="st-form" th:each="carRealDate:${carDate}">
                <div class="st-chek">
                    <input data-input="2" type="checkbox" class="check-son">
                </div>
                <div class="st-goods">
                    <div><a th:href="@{'goods/selectOneGood?goodId='+${carRealDate.getId()}}" ><img th:src="@{'../../static/img/'+${carRealDate.getPhotoName()}}"></a></div>
                    <div><a th:href="@{'goods/selectOneGood?goodId='+${carRealDate.getId()}}" th:text="${carRealDate.getName()}"></a></div>
                </div>
                <div class="st-props">
                    <div></div>
                    <div></div>
                </div>
                <div class="st-price" th:text="'¥'+${carRealDate.getPrice()}"></div>
                <div class="st-quantity">
                    <a class="quantity-reduce">-</a>
                    <input type="text" th:data-idnumber="${carRealDate.getId()}" data-num="0"  th:value="${carRealDate.getNumber()}" class="quantity-input" readonly="readonly">
                    <a class="quantity-add">+</a>
                </div>
                <div class="st-sum" th:text="'¥'+${(carRealDate.getPrice()*carRealDate.getNumber())}"></div>
                <div class="st-action"><a th:href="@{'http://localhost:8080/user/deleteDateCar?orderId='+${carRealDate.getCarId()}}">删除</a></div>
            </div>

<!--            结算-->
            <div class="st-set">
                <div class="set-go"><a href="javascript:;">去结算</a></div>
                <div class="set-money">总价:￥0</div>
            </div>
        </div>
<!--推荐的商品-->
        <div class="s-recommend">
            <!--        第一个轮播图-->
            <div class="s-recommend-h3">
                <h3>您可能还需要</h3>
            </div>
            <div class="s-recommend-goods">
                <div class="s-goods-big">
                    <ul>
                        <li  th:each="hot:${hotGoods}">
                            <div class="s-big-Fdiv">
                                <a th:href="@{'http://localhost:8080/goods/selectOneGood?goodId='+${hot.getId()}}"><img th:src="@{'../../static/img/'+${hot.getPhotoName()}}"></a>
                            </div>
                            <div class="s-big-Sdiv">
                                <div class="s-Sdiv">
                                    <a th:href="@{'http://localhost:8080/goods/selectOneGood?goodId='+${hot.getId()}}" th:text="${hot.getName()}"></a>
                                </div>
                                <div class="s-money" th:text="'￥'+${hot.getPrice()}" ></div>
                                <div class="s-shopping"><a th:href="@{'http://localhost:8080/goods/selectOneGood?goodId='+${hot.getId()}}">
                                    <img src="../../static/img/shopping.png">
                                    查看物品详情
                                </a></div>
                            </div>
                        </li>
                    </ul>
                </div>

            </div>
            <div class="s-panel">
                <ul>
                    <li class="s-panel-li01">1</li>
                    <li class="s-panel-li02">2</li>
                </ul>
            </div>

        </div>

    </div>
    <!--底部-->
<div th:replace="/like/likeFooter::foot"></div>
    <!--返回顶部-->
<div th:replace="/like/return-top::top"></div>
</body>
<script th:src="@{/static/js/jquery-3.3.1.min.js}"></script>
<script th:src="@{../../static/js/likeFooter.js}" type="text/javascript"></script>
<script th:src="@{../../static/js/shoppingTrolley.js}"></script>
<script th:src="@{../../static/js/shoppingCart.js}"></script>
<script th:src="@{/static/js/index.js}"></script>
</html>